<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
	.nochoice {color: black;}
	.choice {color: blue;}
-->
</style>
<script type="text/javascript">
<!--
function redirect(pulldown) {
	var newLocation = pulldown[pulldown.selectedIndex].value;
	if (newLocation != "")
	self.location = newLocation; //如果进行了选择，则载入相应的页面
}
function resetIfBlank(pulldown) {
	var possibleNewLocation = pulldown[pulldown.selectedIndex].value;
	if (possibleNewLocation == "")
	pulldown.selectedIndex = 0; //由于没有进行选择，所以回到默认位置
}
//-->
</script>
</head>
<body>
<center>
<h1>改进的下拉菜单<h1>
<form name="navform" id="navform" action="redirector.cgi" method="post">
<h3>友情链接:</h3>
<!--建立一个选择下拉菜单-->
<select name="menu" id="menu" onchange="resetIfBlank(this);">
	<option value="" class="nochoice" selected="selected">选择站点</option>
	<option value="" class="nochoice"></option>
	<option value="" class="nochoice">搜索引擎</option>
	<option value="" class="nochoice">---------------------------</option>
	<option value="http://www.google.com" class="choice">Google</option>
	<option value="http://www.yahoo.com" class="choice">Yahoo!</option>
	<option value="http://www.baidu.com" class="choice">百度</option>
	<option value="" class="nochoice"></option>
	<option value="" class="nochoice">电子商务</option>
	<option value="" class="nochoice">---------------------------</option>
	<option value="http://www.amazon.com" class="choice">Amazon</option>
	<option value="http://www.buy.com" class="choice">Buy.com</option>
	<option value="" class="nochoice"></option>
	<option value="" class="nochoice">Demos</option>
	<option value="" class="nochoice">---------------------------</option>
</select>
<!--通过onclick 调用redirect()进行页面载入-->
<input type="submit" value="Go" onclick="redirect(document.navform.menu); return false;">
</form>
</center>
<script type="text/javascript">
<!--
	document.navform.menu.selectedIndex = 0; //设置选择的默认起始位置
//-->
</script>
</body>
</html>